:root {
    --my-height: 80px;
    --top-height: 60%;
    --my-size:18px;
}

* {
    margin: 0;
    padding: 0;
}
input,
UL li {
    list-style: none;
}

.top {
    display: flex;
    width: 100%;
    height: var(--my-height);
    background-color: white;
    border: 1px solid rgb(246, 237, 237);
    /* background-color: burlywood; */
}

.top .top-big {
    width: 91.3%;
    margin: 0 auto;
    display: flex;
}

.top .top-left {
    width: 25%;
    height: var(--my-height);
    /* background-color: cadetblue; */
    display: flex;
    justify-content: center;
    align-items: center;
}

.top .top-main {
    width: 50%;
    height: var(--my-height);
    /* background-color: rgb(93, 114, 115); */
    display: flex;
    /* justify-content: center; */
    align-items: center;
}

.top .top-main .top-photo {
    width: 6%;
    height: var(--top-height);
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #ccc;
    border-left: 0px;
}
.top .top-main input:nth-of-type(1):hover~.top-photo
{
    border: 1px solid rgb(204, 204, 245);
    border-left: 0px;
}
.top .top-main .top-photo img {
    width: 54%;
    height: 60%;
}

.top .top-main input:nth-of-type(1) {
    font-size: var(--my-size);
    color: rgb(198, 191, 191);
    width: 80%;
    height: var(--top-height);
    border: 1px solid #ccc;
    border-right: 0px;
}
.top .top-main input:nth-of-type(1):hover {
border: 1px solid rgb(204, 204, 245);
border-right: 0px;
}

.top .top-main input:nth-of-type(2) {
    font-size: var(--my-size);
    color: white;
    width: 15%;
    height: var(--top-height);
    background-color: rgb(101, 101, 243);
    margin-right: 4%;
    border: 0px;
}
.top .top-main input:nth-of-type(2):hover
{
    background-color: rgb(126, 126, 239);
}

.top .top-right {
    width: 25%;
    height: var(--my-height);
    /* background-color: rgb(64, 235, 241); */
    display: flex;
    align-items: center;
    justify-content: center;
    /* margin: auto 0; */
}

.top .top-right ul {
    width: 100%;
    display: flex;
    /* border: 1px solid; */
}

.top .top-right ul li {
    font-size: var(--my-size);
    /* width: 25%; */
    margin-left: 5%;
}

.top .top-right ul li:hover {

    color: rgb(174, 174, 239);
}